<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<%@ include file="/WEB-INF/common/init.jsp"%>
<link href="<%=path%>/res/css/patternLock.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="<%=path%>/res/js/patternLock.min.js"></script>
<title>绑定帐号</title>
</head>
<body>
	
<form id="form1" method="post" action="<%=path%>/u?m=tR">
	<input id="wxId" name="wxId" type="hidden" value="<%=request.getParameter("wxId")%>">
	<div class="weui-cells weui-cells_form">
		<div class="weui-cell" style='padding:0px'>
			<div id='1' class="weui-navbar__item weui-bar__item_on">创建新家庭</div>
			<div id='2' class="weui-navbar__item">加入某家庭 </div>
		</div>
		<div class="weui-cell">
			<div class="weui-cell__hd"><label class="weui-label">我的昵称:</label></div>
			<div class="weui-cell__bd"><input class="weui-input" type="text" id="name" placeholder="据说有昵称的感觉会更好~"></div>
		</div>
		<div class="weui-cell">
			<div class="weui-cell__hd"><label class="weui-label">家庭名称:</label></div>
			<div class="weui-cell__bd"><input class="weui-input" type="text" id="familyName" placeholder="一个好家庭，怎能没有靓名称~"></div>
		</div>     
		<div class="weui-cell">
			<div class="weui-cell__hd"><label	>请输入一次图形密码</label></div>
		</div>
		<div  style="text-align:center">
		<div id="p1" style='margin:auto;'></div>
	</div>   
		<div class="weui-cell">
			<div class="weui-cell__hd"><label	>请再次输入图形密码</label></div>
		</div>
			<div style="text-align:center">
				<div id="p2" style='margin:auto;'></div>
			</div>
		 <div class="weui-cell">
			<a href="javascript:;" class="weui-btn weui-btn_primary" onclick="bindAccount()">完成输入</a>
		</div>
	</div>
</form>
		
<script type="text/javascript">
	var cur_familyOper=1;// 1=创建，2=加入
    $(function(){
        $('.weui-navbar__item').on('click', function () {
        	cur_familyOper=$(this).attr('id')
        	 $(this).addClass('weui-bar__item_on ').siblings('.weui-bar__item_on').removeClass('weui-bar__item_on');
           });
        window.lock1 = new PatternLock("#p1",{allowRepeat : true});
        window.lock2 = new PatternLock("#p2",{allowRepeat : true});
    });
		function bindAccount() {
			if ($.trim($("#name").val()).length == 0) {
				error("#name","据说有昵称的感觉会更好，赶紧写一个吧！")
				return
			}
			if(!checkInput($("#name").val())){
				error("#name","您的昵称太奇葩，我不认识，换一个吧！")
				return 
			}
			if ($.trim($("#familyName").val()).length == 0) {
				error("#familyName","一个好家庭，怎能没有靓名称，赶紧写一个吧！")
				return
			}
			if(!checkInput($("#familyName").val())){
				error("#familyName","您的家庭名称太奇葩，我不认识，换一个吧！")
				return 
			}
			if ($.trim(lock1.getPattern()).length == 0) {
				error("#pwd1","为保证安全性，请输入图形密码！")
				return
			}
			if ($.trim(lock1.getPattern())!=$.trim(lock2.getPattern())) {
				error("#pwd1","两次输入的密码不一致，请重新输入！")
				return
			}
			//
			var url="<%=path%>/u?m=R";
			$.post(url, { wxId: $("#wxId").val(),name:$("#name").val() 
				         ,familyOper:cur_familyOper ,familyName:$("#familyName").val()
				         ,pwd1:lock1.getPattern() ,pwd2:lock2.getPattern()}	   
					  ,function(data){
							if(data.success){
								window.location.href="<%=path%>/u?m=overview";
							}else if(data.value==1){
								$("#form1").submit();
							}else if(data.value==2){
								window.location.href="<%=path%>/u?m=mgr";
							}else{
								alert(data.msg)
							}
					   }, "json");
		}
	</script>
</body>
</html>